<template>
  <!-- 五防钥匙箱统计详情-上半部分 -->
  <div class="five-key-details">
    <div class="five-key-details-bottom betweenbox">
      <div class="left-pie borderStyle">
        <LeftPie :formData="formData" />
      </div>
      <div class="right-bar borderStyle">
        <RightBar :formData="formData" />
      </div>
    </div>
  </div>
</template>

<script lang="ts">
import { Component, Vue,Prop } from "vue-property-decorator";
import LeftPie from "../components/LeftPie.vue";
import RightBar from "../components/RightBar.vue";
import { JointInspectionModule } from "@/store/modules/JointInspection";
@Component({
  components: {
    LeftPie,
    RightBar,
  },
})
export default class FiveKeyDetails extends Vue {
   @Prop() formData!: any;
}
</script>

<style lang="scss" scoped>
.five-key-details {
  width: 100%;
  height: 100%;
  &-bottom {
    width: 100%;
    height: calc(100% - 0.4rem);
    margin: 0.2rem 0;
    box-sizing: border-box;
    .left-pie {
      width: calc(50% - 0.1rem);
      height: 100%;
    }
    .right-bar {
      width: calc(50% - 0.1rem);
      height: 100%;
    }
  }
}
</style>